<!--  -->
<template>
  <div class="dingdanxq">
    <van-nav-bar
      title="订单详情"
      left-text="返回"
      @click-left="$router.back()"
    />
    <van-steps :active="order_status">
      <van-step>买家下单</van-step>
      <van-step>商家接单</van-step>
      <van-step>买家提货</van-step>
      <van-step>交易完成</van-step>
    </van-steps>
    <van-cell :title="userinfo" :label="addressinfo"  class="hfdkfkd"/>
     <van-card
        v-for="item in orderProducts"
        :key="item.id"
        :num="item.count"
        :price="item.price.toFixed(2)"
        :title="item.name.split(' ')[0]"
        :thumb="item.cover"
      />
      <van-submit-bar v-if='order_status==0' :price="zongjiag" button-text="付款"  button-type="primary" @submit="onSubmit" >
      <span>共计{{hejishul}}件</span>
    </van-submit-bar>
      <van-submit-bar :price="zongjiag" button-text="等待发货"  button-type="info" v-else-if="order_status==1">
      <span>共计{{hejishul}}件</span>
    </van-submit-bar>
    <mima ref="srmm" :djfd="orderid" ></mima>
  </div>
</template>

<script>
import { huoqudd } from "network/api.js";
import mima from 'components/mima.vue'
export default {
  name: "",
  components:{mima},
  data() {
    return {
      order_status:'',
      orderProducts:[],
      userinfo:'',
      addressinfo:'',
      orderid:''
    };
  },

  computed: {
    zongjiag(){
      return this.orderProducts.reduce((p,c)=>p+c.price*c.count,0)*100
    },
    hejishul(){
      return this.orderProducts.reduce((p,c)=>p+c.count,0)
    }
  },

  methods: {
    async hqdingdanxx() {
      
      this.orderid=this.$route.query.id
      console.log(this.orderid)
      const {data,errmsg} = await huoqudd(this.$route.query.id);
      console.log(errmsg)
      console.log(data)
      let{order_status,orderProducts,userAddress}=data
      this.order_status=order_status
      this.orderProducts=orderProducts
      console.log(userAddress)
      let{name,mobile,province,city,country,detail}=userAddress
      this.userinfo=`${name},${mobile}`
      this.addressinfo=`${province} ${city} ${country} ${detail}`
    },
    onSubmit(){
      this.$refs.srmm.showPopup()
    }
  },
  created() {
    this.hqdingdanxx();
   
  },
};
</script>
<style lang='less' scoped>
</style>